<template>
      <div>
            <div style="margin-bottom: 5px;margin-top: 5px;text-align: center">
                  <el-input v-model="name" placeholder="请输入姓名" style="width: 200px" suffix-icon="Search"
                            @keyup.enter.native="loadPost"
                  ></el-input>
                  <el-select
                            v-model="species"
                            placeholder="请选择案件类型"
                            style="width: 200px"
                  >
                        <el-option
                                  v-for="item in speciess"
                                  :key="item.value"
                                  :label="item.label"
                                  :value="item.value"
                        />
                  </el-select>
                  <el-button style="margin-left: 5px" type="primary" @click="loadPost">查询</el-button>
                  <el-button type="danger" @click="resetParam">重置</el-button>
            </div>
            <el-scrollbar>
                  <el-table :data="tableData">
                        <el-table-column label="申请人" prop="persona"/>
                        <el-table-column label="被申请人" prop="personb"/>
                        <el-table-column label="案件类型" prop="species">
                              <template v-slot="scope">
                                    <el-tag
                                              :type="scope.row.species=== 0 ? 'primary' :(scope.row.species=== 1 ? 'success': 'danger' )"
                                              disable-transitions
                                    >{{
                                                scope.row.species === 0 ? '民事案件' : (scope.row.species === 1 ? '刑事案件' : '行政案件')
                                          }}
                                    </el-tag
                                    >
                              </template>
                        </el-table-column>
                        <el-table-column label="状态" prop="state">
                              <template v-slot="scope">
                                    <el-tag
                                              :type="scope.row.state=== 0 ? 'primary' :(scope.row.state=== 1 ? 'success': 'danger' )"
                                              disable-transitions
                                    >{{ scope.row.state === 0 ? '未受理' : (scope.row.state === 1 ? '已指派' : '已结案') }}
                                    </el-tag
                                    >
                              </template>
                        </el-table-column>
                        <el-table-column label="操作" prop="operate">
                              <template v-slot="scope">
                                    <el-button size="small" type="success" @click="modify(scope.row)">案由详情</el-button>
                                    <el-button size="small" type="warning" @click="select(scope.row)">指派律师</el-button>
                              </template>
                        </el-table-column>
                  </el-table>
            </el-scrollbar>

            <el-pagination v-model:current-page="pageNum"
                           v-model:page-size="pageSize"
                           :page-sizes="[2, 5, 10,20]"
                           :total="total"

                           layout="total, sizes, prev, pager, next, jumper"
                           style="position: relative  ;bottom: 10%;left: 350px"
                           @size-change="handleSizeChange"
                           @current-change="handleCurrentChange"
            />

            <el-dialog
                      v-model="dialogVisible"
                      :before-close="handleClose"
                      style="text-align: center;width: 500px"
                      title="案件详情"
            >
                  <el-form ref="form" :model="form" :rules="rules" label-width="auto" style="max-width: 600px">
                        <el-form-item label="申请人" prop="persona">
                              <el-col :span="22">
                                    <el-input v-model="form.persona"/>
                              </el-col>
                        </el-form-item>
                        <el-form-item label="身份证号" prop="carda">
                              <el-col :span="22">
                                    <el-input v-model="form.carda"/>
                              </el-col>
                        </el-form-item>
                        <el-form-item label="被申请人" prop="personb">
                              <el-col :span="22">
                                    <el-input v-model="form.personb"/>
                              </el-col>
                        </el-form-item>
                        <el-form-item label="身份证号" prop="cardb">
                              <el-col :span="22">
                                    <el-input v-model="form.cardb"/>
                              </el-col>
                        </el-form-item>
                        <el-form-item label="案件详情" prop="content">
                              <el-col :span="22">
                                    <el-input v-model="form.content" type="textarea"/>
                              </el-col>
                        </el-form-item>
                  </el-form>
                  <br>
                  <template #footer>
                        <div class="dialog-footer" style="text-align: center">
                              <el-button @click="dialogVisible = false">Cancel</el-button>
                              <el-button type="primary" @click="save">Confirm</el-button>
                        </div>
                  </template>
            </el-dialog>
            <el-dialog
                      v-model="dialogLawyerVisible"
                      style="text-align: center;width: 500px"
                      title="指派律师"
            >
                  <el-scrollbar>
                        <el-table :data="lawyerData">
                              <el-table-column label="律师名" prop="name"/>
                              <el-table-column label="执业类型" prop="classify">
                                    <template v-slot="scope">
                                          <el-tag
                                                    :type="scope.row.classify=== '0' ? 'primary' :(scope.row.classify=== '1' ? 'success': 'danger' )"
                                                    disable-transitions
                                                    size="large"
                                          >{{
                                                      scope.row.classify === '0' ? '民事案件' : (scope.row.classify === '1' ? '刑事案件' : '行政案件')
                                                }}
                                          </el-tag
                                          >
                                    </template>
                              </el-table-column>
                              <el-table-column label="操作" prop="operate">
                                    <template v-slot="scope">
                                          <el-button size="default" type="primary" @click="selectConfirm(scope.row)">
                                                确认指派
                                          </el-button>
                                    </template>
                              </el-table-column>
                        </el-table>
                  </el-scrollbar>
            </el-dialog>
      </div>
</template>

<script>
export default {
      name: "adminLawCaseManage",
      data() {
            return {
                  dialogVisible: false,
                  dialogLawyerVisible: false,
                  form: {
                        id: '',
                        personA: '',
                        cardA: '',
                        personB: '',
                        cardB: '',
                        content: '',
                        state: '',
                        species: '',
                        DT: '',
                        flag: ''
                  },
                  tempLawCase: {
                        id: '',
                        personA: '',
                        cardA: '',
                        personB: '',
                        cardB: '',
                        content: '',
                        state: '',
                        species: '',
                        DT: '',
                        flag: ''
                  },
                  lawyerData: {
                        id: '',
                        name: '',
                        password: '',
                        card: '',
                        classify: '',
                        credential: '',
                        state: '',
                        num: '',
                        creNum: '',
                        img: ''
                  },
                  assistance:{
                        id:'',
                        persona:'',
                        personb:'',
                        lawyer:'',
                        time1:'',
                        time2:'',
                        time3:'',
                        flag:'',
                        content: ''
                  },
                  tableData: [],
                  pageSize: 5,
                  pageNum: 1,
                  total: 0,
                  speciess: [
                        {
                              value: '0',
                              label: '民事案件',
                        },
                        {
                              value: '1',
                              label: '刑事案件',
                        },
                        {
                              value: '2',
                              label: '行政案件',
                        }

                  ],
            }
      },
      methods: {
            loadGet() {
                  this.$axios('http://localhost:8088/lawcase/list').then(res => res.data).then(res => {
                        console.log(res)
                  })
            },
            loadPost() {
                  this.$axios.post('http://localhost:8088/lawcase/listPageResult', {
                        pageSize: this.pageSize,
                        pageNum: this.pageNum,
                        param: {}

                  }).then(res => res.data).then(res => {
                        console.log(res)
                        if (res.code === 200) {
                              // alert("是200")
                              this.tableData = res.data
                              this.total = res.total
                              console.log(res.total)
                        } else {
                              alert("不是200")
                        }
                  })
            },
            loadLawyer() {
                  this.$axios.get('http://localhost:8088/lawyer/list').then(res => {
                        // console.log("数据数据===="+res.data)
                        this.lawyerData = res.data
                  })
            },
            modify(row) {
                  console.log(row)
                  //      赋值到表单
                  this.dialogVisible = true
                  this.$nextTick(() => {
                        this.form = row
                        this.form.state = row.state + ''
                        this.form.species = row.species + ''
                  })
            },
            select(row) {
                  this.loadLawyer()
                  this.assistance.persona=row.persona
                  this.assistance.personb=row.personb
                  this.assistance.content=row.content
                  this.assistance.time1=row.dt
                  this.assistance.time2=new Date().getDate()+new Date().getTime()
                  this.assistance.flag=1
                  this.tempLawCase=row
                  this.dialogLawyerVisible=true;
            },
            selectConfirm(row){
                  console.log("selectConfirm=="+row.name)
                  this.assistance.lawyer=row.name

                  this.$axios.post('http://localhost:8088/assistance/select',this.assistance).then(res=>res.data).then(res=>{
                        console.log(res)
                        this.$message({
                              message: 'Congratulation, this is a success operate.',
                              type: 'success',
                        })
                        this.tempLawCase.state=1
                        this.$axios.post('http://localhost:8088/lawcase/modifyState',this.tempLawCase)
                        this.dialogLawyerVisible=false;
                  })

            },
            handleSizeChange(val) {
                  console.log(`${val} items per page`)
                  this.pageNum = 1
                  this.pageSize = val
                  this.loadPost()
            },
            handleCurrentChange(val) {
                  console.log(`current page: ${val}`)
                  this.pageNum = val
                  this.loadPost()
            },
            resetParam() {
                  this.name = ''
                  this.sex = ''
            }
      },
      mounted() {
            // this.loadGet();
            this.loadPost();
            this.loadLawyer();
      }
}
</script>

<style scoped>
.el-textarea {
      height: 88px;
}

:deep(.el-textarea__inner) {
      height: 128px;
}

</style>